import Qt 4.7
import "ColumnHelper.js" as ColumnHelper
import "Parsers.js" as Parsers

Item {
    id: legs
    property string xml
    property int routeIndex: 0

    onRouteIndexChanged: {
        console.log("MAXMAXMAX/routeIndex="+routeIndex)
    }
    onXmlChanged: {
        console.log("MAXMAXMAX/xmlChanged")
    }

    XmlListModel {
        id: model
        xml:  legs.xml
        query: "/response/node["+(routeIndex+1)+"]/node/legs/node"
        XmlRole { name: "length"; query: "length/string()" }
        XmlRole { name: "duration"; query: "duration/string()" }
        XmlRole { name: "type"; query: "type/string()" }
        XmlRole { name: "depTime"; query: "locs/node[1]/depTime/string()" }
        XmlRole { name: "arrTime"; query: "locs/node[last()]/arrTime/string()" }
    }

    ListView {
        id: list
        anchors.fill: parent
        property variant columnWidths: ColumnHelper.calcColumnWidths(model, list, Parsers.parseTime, Parsers.parseType)

        orientation: "Vertical"
        model: model
        delegate: legDelegate
    }

    Component {
        id: legDelegate
        Item {
            id: item
            width: parent.width - 15
            height: row.height

            function altColor(i) {
                var colors = [ "#bebebe", "#b7b7b7" ];
                return colors[i];
            }

            Rectangle {
                id: background
                width: parent.width + 15
                height: parent.height
                color: {
                    var retVal="black";
                    if (index!=-1) {
                        retVal = altColor(index%2)
                    }

                    return retVal;
                }
            }

            Row {
                id: row
                width: parent.width
                spacing: 5
                Item {
                    // Indent a little
                    width: 5
                    height: 1
                }
                Text {
                    width: list.columnWidths['type']
                    text: Parsers.parseType(model.type)
                    color: "blue"
//                    color: "white"
                }
                Loader { sourceComponent: columnSeparator; height: parent.height }
                Text {
                    width: list.columnWidths['duration']
                    text: model.duration
//                    color: "white"
                }
                Loader { sourceComponent: columnSeparator; height: parent.height }
                Text {
                    width: list.columnWidths['length']
                    text: model.length
//                    color: "white"
                }
                Loader { sourceComponent: columnSeparator; height: parent.height }
                Text {
                    width: list.columnWidths['depTime']
                    text: Parsers.parseTime(model.depTime)
//                    color: "white"
                }
                Loader { sourceComponent: columnSeparator; height: parent.height }
                Text {
                    width: list.columnWidths['arrTime']
                    text: Parsers.parseTime(model.arrTime)
//                    color: "white"
                }

                Component {
                    id: columnSeparator
                    Rectangle {
                        width: 1
                        color: "black"
//                        color: "white"
                        opacity: 0.3
                    }
                }
            }
        }
    }
}
